import React, { Component } from 'react';
import {
  Alert,
  StyleSheet,
  Text,
  View,
  ScrollView,
  Image,
  Animated,
  TouchableOpacity,
  Linking,
  NativeModules,
  NetInfo
} from 'react-native';
import styles from './aboutKeeperStyle';

import EasemobChat from '../global/EasemobChat';
import ToastTip from '../global/ToastTip';
import api from "../../services/api";
import VersionModal from './versionUpdate';

class AboutKeeper extends Component {
    constructor(props) {
		super(props);

		this.state = {
            scrollY: new Animated.Value(0),
            showModal:false,
            currentVersionName:'',
            currentVersionNum:'',
            lastVersionInfo:{},
            showRedDot:false
		};
	}

    async componentWillMount() {
        NativeModules.CommonUtils.getVersionAndCode(async (versionCode,versionName) => {
            this.setState({
                currentVersionNum:versionCode,
                currentVersionName:versionName
            })
            let result = await api.post('/version/android/last')
            console.log(result,'version/android/last')
            if (result.cd == 0) {
                this.setState({
                    lastVersionInfo:result.data,
                })
                if (result.data.versionNum > versionCode) {
                    this.setState({showRedDot:true})
                }
            }else{
                this.refs.toast.show("获取版本信息失败！")
            }
        })
	}

    _editPassword(){
        let {navigator} = this.props;
        let {currentVersionNum,currentVersionName} = this.state;
        // Alert.alert('status');
        NetInfo.fetch().done(status => {
            // Alert.alert(status);
            if (status == "NONE") {
                this.refs.toast.show("网络开了一会小差，请稍后再试")
            }else{
                navigator.push({
                    title: currentVersionName+"版本",
                    backButtonTitle:'',
                    screen: 'housekeeperapp.versionupdateintro',
                    passProps: {
                        versionNum:currentVersionNum
                    },
                    navigatorStyle:{
                        navBarHidden: false,
                        tabBarHidden: true,
                        navBarTextColor: 'white',
                        navBarButtonColor: 'white',
                        navBarBackgroundColor: '#EA5404',
                        statusBarColor: '#EA5404',
                        navBarTitleTextCentered: true,
                        topBarElevationShadowEnabled:false
                    },
                    navigatorButtons: {
                        leftButtons:[
                            {
                                id: 'back',
                                icon: require("../../../img/hk_back_icon.png")
                            }
                        ]
                    }
                });
            } 
        });

        
    }



    // checkLastVersion(){
    //     console.log('test',"ddddd");
    //     this.doFetchLastVersion();
    // }

    async checkLastVersion(){
        let {currentVersionNum} = this.state;
        console.log('account is mount==========',currentVersionNum) 
        let res = await api.post('/version/android/last')
        console.log(res,'version/android/last')
        if (res.cd == 0&&res.data.versionNum > currentVersionNum) {
            this.setState({lastVersionInfo:res.data},() => {
                this.setState({showModal:true})
            })
        }else if(res.cd == 0&&res.data.versionNum == currentVersionNum){
            this.refs.toast.show('当前已是最新版本')
        }else if(res.cd ==1){
            this.refs.toast.show(res.msg);
        }else{
            this.refs.toast.show('网络开了一会小差，请稍后再试')
        }
    }

    closeModal = () => {
        this.setState({showModal:false})
    }

    render() {
        let {currentVersionName,currentVersionNum} = this.state;

        return (
            <View style={styles.container}>
                <View style={styles.aboutKeeper}>
                    <Image source={require("../../../img/about_keeper_bg.png")} style={{width:140,height:120}}/>
                    <Text style={styles.versionNumber}>V{currentVersionName}</Text>
                </View>
                <View style={styles.infoList}>
                    <TouchableOpacity onPress={this._editPassword.bind(this)} style={[styles.addBtn]}>
                        <Text style={[styles.addText,{marginLeft:0}]}>版本介绍</Text>
                        <Text style={[styles.rightImage,{color:"#B5B5B5",fontSize:15,marginRight:10}]}></Text>
                        <Image source={require('../../../img/hk_arrow_icon.png')} style={styles.rightImage}/>
                    </TouchableOpacity>
                    <TouchableOpacity onPress={this.checkLastVersion.bind(this)} 
                    style={[styles.addBtn,{position:'relative'}]}>
                        <Text style={[styles.addText,{marginLeft:0}]}>检查最新版本</Text>
                        {this.state.showRedDot?<Image source={require('../../../img/Oval.png')} style={[{color:"#B5B5B5",width:6,height:6,fontSize:20,position:'absolute',color:'red',left:110}]}/>:null}
                        {this.state.showRedDot?<Text style={[{color:"#b5b5b5",fontSize:15,position:'absolute',right:40}]}>V{this.state.lastVersionInfo.version}</Text>:null}
                        <Image source={require('../../../img/hk_arrow_icon.png')} style={styles.rightImage}/>
                    </TouchableOpacity>
                </View>
                <View style={styles.copyRight}>
                    <Text style={styles.copyRightText}>Copyright©2018云简（北京）网络科技有限公司</Text>
                    <Text style={styles.copyRightText}>京ICP备案16045483号-1</Text>
                </View>
                <ToastTip ref="toast" offsetY={160}/>
                <VersionModal showModal={this.state.showModal} lastVersionInfo={this.state.lastVersionInfo} closeModal={this.closeModal}></VersionModal>
            </View>
        );
    }
}

var connectHelper = require('../../services/connectHelper');
AboutKeeper = connectHelper(state => state)(AboutKeeper);

module.exports = AboutKeeper;
